@charset "utf-8";
/*1rem=16px*/
* {margin: 0; padding: 0;}
html {box-sizing: border-box; font-size: 16px;}
body {
    font-family: 'Times New Roman', Times, serif;
    -webkit-font-smoothing: antialiased;
    box-sizing: inherit;
    min-width: 65rem;
    background-position-x:center;
    background-repeat:repeat-y; 
}
a {
    text-decoration: none;
    color:whitesmoke;
}
.ui {
    font-style: normal;
    font-family: "宋体",Arial,Helvetica,sans-serif;
}
.ui.field {
    width: 65rem;
    box-sizing: inherit;
    margin: 0 auto;
    height: inherit;
}
.ui.show {
    font-weight: bold;
    color:red;
}
.ui.bar {
    color:rgba(0, 0, 0, 0.1);
    height: inherit;
    box-sizing: inherit;  
    background-color: rgba(0, 0, 0, 0.1);
    overflow: hidden;
    vertical-align: top;
    border-style: solid;
}
.link .image {opacity: 0.8;}
.link .image:hover { opacity: 1;}
.image.inline {width: 100%; overflow: hidden;}
.link.inline {
    height:100%; 
    text-align: center;
    overflow: hidden;
}
header, main {
    padding: 0 1rem;      
    width: 100%;
    box-sizing: inherit;
}
header {
    top: 0;
    opacity: 0.9;
    height: 4rem;   
}
.fix {position: fixed;}
header.fix {
    background-color: rgb(93, 137, 179);
    z-index: 100;
}
header .ui.bar {float: right; width: 24.2%;}
header .bar .ui.inline { 
    color:whitesmoke;
    line-height: 2rem;
    text-align: center;
}
header.black {
    background-color:rgba(0, 0, 0, 0.8); 
    height: 50px;
}
header.black .show {font-size:3rem; font-style: italic;}
header.black .ui.inline {
    font-size: 2rem;
    font-family: Arial, Helvetica, sans-serif;
}
#logo { 
    height: inherit;
    width: 14rem;
    display: inline-block;
    overflow: hidden;
}
#logo .image.inline {height: 100%; opacity: 1;}
nav {
    margin-left: -0.6%;
    vertical-align: top;
    display: inline-block;
    height: 100%;
    width: 50%;
    overflow: hidden;
}
nav ul {
    width: 100%;
    list-style-type: none;
    float: left;
}
nav a {
    line-height: 4rem;
    float: left;
    width: 33.3%;
}
nav a:link, nav a:visited {background-color: rgb(93, 137, 179);}
nav a:hover, nav a:active {background-color: rgba(0, 0, 0, 0.1);}
main .link .image {height: 37.5rem;} 
footer {
    line-height: 100%;
    color: whitesmoke;
    background-color: rgba(0,0,0,0.8);
    text-align: center;
}
.opacity {opacity:0.7;}
#introduction {padding: 0;}
#introduction .ui {
    padding: 1rem 20%;
    color:whitesmoke;
    background-color:rgba(0, 0, 0, 0.555);
    height:21.875rem;
}
body.blank {padding: 4em 0 0 0;}
#canvas_ui {
    position: relative;
    margin-top: -112.5rem;
    height: 112.5rem;
    width: auto;
    float: left;
    z-index: -1;
}
#login_bar {
    font-size: 1.5rem;
    width: 40rem;
    height: 30rem;
    background-color: rgba(110, 106, 106, 0.836); 
    margin: 10rem auto;
}
#login_bar form {padding: 0 1.7rem;}
#login_bar header {margin: 1.5rem 0; height: 1rem;}
#login_bar span:first-child {float: left; color: #000;}
#login_bar span:last-child {float: right; color: rgb(243, 9, 9);}
#login_bar main {padding: 1rem 6rem;}
#login_bar .field>input[size] {
    font-size: 2rem;
    background-color: rgb(250, 255, 189);
    width: 100%;
    height: 3rem;
    margin-bottom: 2rem;
}
#login_bar input[type="checkbox"] {float: left;}
#login_bar .field:last-child {width: 6rem; margin: 0 auto;}
#login_bar .field:last-child input{width: 100%;}
#login_bar #remember_me {margin: 2rem 0;}
#login_bar #forget_password {float: right;}
.error-message {color: rgb(252, 45, 45); height: 1rem;}
input[type="checkbox"] {width: 1rem; height: 1rem;}
input[type="submit"],  input[type="button"]{
    font-size: 1.5rem;
    background-color: #fe7300;
    height: 3rem;
    margin: 0.25rem
}
input[type="submit"]:hover, input[type="button"]:hover {
    color: aquamarine;
    cursor: pointer;
} 
header input[type="button"] {width: 44%;}
